define(window.backboneCommon.getViewDefine("targets.device"), function ($,require,Collection,tpl) {
    var defaultsOptions={
        submitCallback:null
    };
    var pagePrivate = {
        getDefaults :function () {
            return defaultsOptions
        },
        getOptions : function (options) {
            options=$.ExtCommon.isCheckEmpty(options)?{}:options;
            return $.ExtCommon.initMergeJson(this.getDefaults(),options);
        }
    };
    var backboneView= Backbone.View.extend({
        events: {
            "click #submit_modal_targetDevice": "saveSubmit"
        },
        initialize: function () {
            this.listenTo(this.model, 'bind:Os', this.bindOs);
            this.listenTo(this.model, 'bind:Connection', this.bindConnection);
            this.listenTo(this.model, 'bind:TelCom', this.bindTelCom);
            this.render();
        },
        render:function(){
            var templateHtml=_.template(tpl);
            this.$el.html(templateHtml());
            return this;
        },
        initMain:function(options){
            this.elementModel={
                os:$('#panel_modal_targetOs'),
                connection:$('#panel_modal_targetConnection'),
                telCom:$('#panel_modal_targetTelCom'),
                modal:$('#modal_targetDevice')
            };
            this.extObject={};
            this.pageData={initPage:false};
            this.pageOptions=$.ExtCommon.initMergeJson(pagePrivate.getOptions(),options);
        },
        initPage:function (json) {
            json=$.ExtCommon.isCheckEmpty(json)?{}:json;
            this.pageData.listSelect=json;
            if(!this.pageData.initPage){
                this.pageData.initPage=true;
                this.collection.initAfterDevice();
            }else{
                this._initRadioCheckbox("os");
                this._initRadioCheckbox("connection");
                this._initRadioCheckbox("telCom");
            }
            this._showModal();
        },
        bindOs:function () {
            var res=this.model.get("dataOs");
            this._initRadioCheckbox("os",res.data);
        },
        bindConnection:function () {
            var res=this.model.get("dataConnection");
            this._initRadioCheckbox("connection",res.data);
        },
        bindTelCom:function () {
            var res=this.model.get("dataTelCom");
            this._initRadioCheckbox("telCom",res.data);
        },
        _initRadioCheckbox:function(type,data){
            var self=this;
            var dataValue=self.pageData.listSelect[type];
            var arrValue= $.ExtCommon.isCheckEmpty(dataValue)?[]:$.map(dataValue,function(info){return info.id.toString()});
            if(self.extObject[type]){
                self.extObject[type].setValue(arrValue);
            }else{
                data= $.ExtCommon.isCheckEmpty(data)?[]:data;
                self.extObject[type]=self.elementModel[type].ExtRadioCheckbox({type: "checkbox",attrName:type,defaultInfo:{width:85},data: data,initValue: arrValue});
            }
        },
        _checkForm:function () {},
        saveSubmit:function () {
            var jsonData={};
            var os=this.extObject["os"].getValueList();
            var connection=this.extObject["connection"].getValueList();
            var telCom=this.extObject["telCom"].getValueList();
            if(os.length>0){jsonData.os=os}
            if(connection.length>0){jsonData.connection=connection}
            if(telCom.length>0){jsonData.telCom=telCom}
            this._hideModal();
            if(this.pageOptions.submitCallback){this.pageOptions.submitCallback(jsonData);}
        },
        _showModal:function(){
            this.elementModel.modal.modal("show");
            $.ExtAssist.modal.computeTop(this.elementModel.modal);
        },
        _hideModal: function () {
            this.elementModel.modal.modal("hide");
        }
    });
    var viewModel=function(options){
        this.collection= new Collection();
        this.model=this.collection.model;
        this.view=new backboneView({el:options.pElement,collection:this.collection,model:this.model});
        this.view.initMain(options);
    };
    viewModel.prototype={
        init:function (json) {
            this.view.initPage(json);
        }
    };
    return viewModel;
});